import React, { Component } from 'react'

import { connect } from "react-redux"
import action from '../../../store/action/index.js'

import "./store_all.less"

class StoreAll extends Component {
    render() {
        return (
            <div className="store_all_big_box">
                {/* 这会经过循环实现 */}
                <div className="store_all_box">
                    {
                        this.props.storeCommodity.length > 0 ? this.props.storeCommodity.map(item => {
                            return <div className="store_all_cont_box" key={item.commodity_id}  onClick={() => {
                                this.props.history.push('/itemdetail')
                                sessionStorage.setItem('shop_router', JSON.stringify(this.props.history.location.pathname))
                                sessionStorage.setItem("shop_id", JSON.stringify(item.commodity_id))
                                sessionStorage.setItem("shop_img", JSON.stringify(item.commodity_images[0]))
                            }}>
                                <div className="store_all_cont_img">
                                    <img src={item.commodity_images[0]} />
                                </div>
                                <div className="store_all_cont_text">
                                    <h3>{item.commodity_namer}</h3>
                                    <p className="store_all_cont_text_p">{item.commodity_mess}</p>
                                    <p>￥<i>{item.commodity_unitPrice[0]}</i>元</p>
                                </div>
                            </div>
                        }) : null
                    }
                </div>
                {/* 底部信息 */}
                <div className="store_all_cont_btm"><span>---------</span>我们是有底线的<span>---------</span></div>

            </div>
        )
    }
}

export default connect(state => state.foodf, action.foodf)(StoreAll)
